<template>
    <div class="app-container home">
        <el-row :gutter="20">
            <el-col :sm="24" :lg="24" style="padding-left: 20px">
                <h2 v-if="systemFlag">EduEchoPro(智能听力播放器)系统</h2>
                <h2 v-else>EchoTrackSystem(回声追踪)系统</h2>
                <p class="system-description" v-if="systemFlag">
                    EduEchoPro(智能听力播放器)系统是一款专为英语老师设计的软件系统，旨在通过便捷的文件管理、智能播放控制和锚点设置等功能，提升英语老师的教学听力体验。软件系统支持多种课程类型，包括初中英语、中考真题、高中英语、高考真题、CET4和CET6，满足不同老师的教学需求。
                </p>
                <p class="system-description" v-else>
                    EchoTrackSystem(回声追踪)系统是一款专为英语老师设计的智能化听力错题管理系统，它通过自动导入错题数据、多维度错题分类、错题分析、个性化教学建议等功能，帮助教师高效管理学生听力学习情况。系统还提供互动式学习工具，促进师生互动，优化教学策略，提升学生英语听力水平。简洁直观的用户界面和响应式设计，确保教师随时随地便捷使用。
                    软件支持多种课程类型，包括初中英语、中考真题、高中英语、高考真题、CET4和CET6，满足不同老师的教学需求。</p>
                <p v-if="systemFlag">
                    <b>当前版本:</b> <span>v{{ version }}</span>
                </p>
                <p v-else>
                    <b>当前版本:</b> <span>v{{ version2 }}</span>
                </p>
            </el-col>
        </el-row>
        <el-divider />
    </div>
</template>

<script>
export default {
    name: "Index",
    data() {
        return {
            // 版本号
            version: "1.3.6",
            version2: "1.5.9",
            systemFlag: false, //true:EduEchoPro(智能听力播放器)；false:EchoTrackSystem(听力错题集)
        };
    },
    methods: {
        goTarget(href) {
            window.open(href, "_blank");
        },
    },
};
</script>

<style scoped lang="scss">
.home {
    blockquote {
        padding: 10px 20px;
        margin: 0 0 20px;
        font-size: 17.5px;
        border-left: 5px solid #eee;
    }

    hr {
        margin-top: 20px;
        margin-bottom: 20px;
        border: 0;
        border-top: 1px solid #eee;
    }

    .col-item {
        margin-bottom: 20px;
    }

    ul {
        padding: 0;
        margin: 0;
    }

    font-family: "open sans",
    "Helvetica Neue",
    Helvetica,
    Arial,
    sans-serif;
    font-size: 20px;
    color: #676a6c;
    overflow-x: hidden;

    ul {
        list-style-type: none;
    }

    h4 {
        margin-top: 0px;
    }

    h2 {
        margin-top: 10px;
        font-size: 40px;
        font-weight: 100;
    }

    p {
        margin-top: 10px;

        b {
            font-weight: 900;
            font-size: 20px;
        }
    }

    .update-log {
        ol {
            display: block;
            list-style-type: decimal;
            margin-block-start: 1em;
            margin-block-end: 1em;
            margin-inline-start: 0;
            margin-inline-end: 0;
            padding-inline-start: 40px;
        }
    }

    .system-description {
        white-space: pre-wrap;
        /* 保留换行符，同时允许自动换行 */
        font-size: 30px;
        /* 调整字体大小 */
        line-height: 1.6;
        /* 调整行间距 */
        font-weight: 400;
        /* 调整字体粗细 */
        color: #333;
        /* 调整字体颜色 */
    }
}
</style>
